<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>结账退房</title>
    <link rel="icon" type="image/png" href="img/favicon.png" />
    <link rel="stylesheet" href="css/amazeui.min.css" />
    <link rel="stylesheet" href="css/layer.css" />
    <link rel="stylesheet" href="css/admin.css" />
    <link rel="stylesheet" href="css/app.css" />
    <script src="jquery/jquery.js"></script>
    <script src="js/echarts.min.js"></script>
    <script src="js/amazeui.min.js"></script>
    <script type="text/javascript" src="jquery/checkin_ajax.js"></script>

</head>
<body>
<ol class="am-breadcrumb">
    <li><a href="base" class="am-icon-home">首页</a></li>
    <li class="am-active">住宿管理</li>
    <li class="am-active">结账退房</li>
</ol>
<div style="background:white">
<h1 style="text-align: center;">账单信息</h1>
<hr>

    <table class="am-table am-table-bd am-table-striped am-table-hover">
        <thead>
        <tr>
            <th>账单ID</th>
            <th>客人ID</th>
            <th>员工ID</th>
            <th>消费金额</th>
        </tr>
        </thead>
        <tbody id="show2">
        </tbody>
    </table>
    <button type="button" class="am-btn am-btn-xs am-round" onclick="javascript:upPage2();" >上一页</button>&nbsp;&nbsp;<button type="button" class="am-btn am-btn-xs am-round" onclick="javascript:downPage2();" >下一页</button>


<h1 style="text-align: center;">客房信息</h1>
<hr>
<!--    <div id="show"></div>-->
    <table class="am-table am-table-bd am-table-striped am-table-hover">
        <thead>
        <tr>
            <th>房间ID</th>
            <th>房间号码</th>
            <th>房间类型</th>
            <th>房间价格</th>
            <th>房间状态</th>
            <th>备注</th>
            <th>订单号</th>
        </tr>
        </thead>
        <tbody id="show">

        </tbody>
    </table>
    <button type="button" class="am-btn am-btn-xs am-round" onclick="javascript:upPage();" >上一页</button>&nbsp;&nbsp;<button type="button" class="am-btn am-btn-xs am-round" onclick="javascript:downPage();" >下一页</button>
<br/>

<div>
    <div class="am-btn-toolbar">
        <div class="am-btn-group ">
            <button  type="button" style="margin-right:20px ;margin-left:700px" class="am-btn  am-btn-success" data-am-modal="{target: '#doc-modal-10'}"><span class="am-icon-money"></span> 结账</button>
            <button  type="button" style="margin-right:20px" class="am-btn  am-btn-primary" data-am-modal="{target: '#doc-modal-11'}"><span class="am-icon-plus"></span> 退房</button>
        </div>

    <div class="am-modal am-modal-no-btn " tabindex="-1" id="doc-modal-10" style="margin-top:-600px" >
        <div class="am-modal-dialog" >
            <div class="am-modal-hd">
                <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
            </div>
            <div class="am-modal-bd">
                <form class="am-form">
                    <fieldset>
                        <legend>结账</legend>
                        <div class="am-form-gruop">
                            <label for="customer_id"> 客人ID</label>
                            <input type="text" id="customer_id">
                        </div>
                        <div class="am-form-gruop">
                            <label for="room_id2"> 房间ID</label>
                            <input type="text" id="room_id2">
                        </div>
                        <div class="am-form-gruop">
                            <label for="cost"> 消费金额</label>
                            <input type="text" id="cost">
                        </div>
                        <input type="button" class="am-btn am-btn-default am-round" value="取消" data-am-modal-close>
                        <input type="button" class="am-btn am-btn-primary am-round" id="addbillbotton" value="确认">
                    </fieldset>
                </form>
            </div>
        </div>
    </div>

    <div class="am-modal am-modal-no-btn " tabindex="-1" id="doc-modal-11" style="margin-top:-600px" >
        <div class="am-modal-dialog" >
            <div class="am-modal-hd">
                <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
            </div>
            <div class="am-modal-bd">
                <form class="am-form">
                    <fieldset>
                        <legend>退房</legend>
                        <div class="am-form-gruop">
                            <label for="room_id"> 房间ID</label>
                            <input type="text" id="room_id">
                        </div>
                        <input type="button" class="am-btn am-btn-default am-round" value="取消" data-am-modal-close>
                        <input type="button" class="am-btn am-btn-primary am-round" id="button2" value="确认" data-am-collapse>
                    </fieldset>
                </form>
            </div>
        </div>
    </div>
    </div>
</div>

</div>
</body>
</html>
